<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <title>CSS Test: Value 'auto' is used for y-dimension in 'background-size'</title> 
    <link rel="author" title="Microsoft" href="http://www.microsoft.com/" />
    <link rel="help" href="http://www.w3.org/TR/css3-background/#the-background-size" />
    <meta name="flags" content="image" />
    <meta name="assert" content="An 'auto' value for y dimension in 'background-size' is resolved by using the image's intrinsic ratio and the size provided for the x-dimension." />
    <style type="text/css">
        div
        {
            margin: 5px;
        }
        .reference
        {
            background: blue;
            width: 50px;
            height: 50px;
        }
        .test
        {
            width: 100px;
            height: 100px;
            background-repeat: no-repeat;
            background-image: url("../support/blue_color.png");
            background-size: 50px auto;
        }
    </style>
    </head>
    <body>
        <p>Test passes if two blue boxes have the same size.</p> 
        <div class="reference"></div>
        <div class="test"></div>
    </body>
</html>